package com.fenghuajueli.module_user.ui.refund

import android.content.Context
import android.content.Intent
import android.os.Bundle
import androidx.activity.compose.setContent
import androidx.activity.viewModels
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.ExperimentalLayoutApi
import androidx.compose.foundation.layout.FlowRow
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.statusBarsPadding
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.verticalScroll
import androidx.compose.material3.Card
import androidx.compose.material3.CardDefaults
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.material3.TextField
import androidx.compose.material3.TextFieldDefaults
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.text.SpanStyle
import androidx.compose.ui.text.buildAnnotatedString
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.text.withStyle
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import coil.compose.AsyncImage
import com.fenghuajueli.lib_pictureselect.PhotoSelectorBuilder
import com.fenghuajueli.lib_pictureselect.config.PhotoConfig
import com.fenghuajueli.libbasecoreui.mvp.BaseActivity
import com.fenghuajueli.libbasecoreui.user.UserInfoUtils
import com.fenghuajueli.module_user.R
import com.fenghuajueli.module_user.ui.theme.ModuleDevTheme
import com.fenghuajueli.module_user.ui.theme.color0A84FF
import com.fenghuajueli.module_user.ui.theme.color999999
import com.fenghuajueli.module_user.ui.widget.UserTopBarWidget
import com.fenghuajueli.module_user.ui.widget.noRippleClickable

class RefundActivity : BaseActivity() {
    companion object {
        @JvmStatic
        fun start(context: Context) {
            val starter = Intent(context, RefundActivity::class.java)
            context.startActivity(starter)
        }
    }
    private val viewModel by viewModels<RefundViewModel>()

    @OptIn(ExperimentalLayoutApi::class)
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        setContent {
            val feedImgData = viewModel.feedImgData.collectAsState()
            val questionDetail = viewModel.questionDetail.collectAsState()
            val canCommit by viewModel.canCommit.collectAsState()
            val isLoading by viewModel.isLoading.collectAsState(null)

            LaunchedEffect(isLoading) {
                isLoading?.let {
                    if (it)
                            showLoadingDialog()
                        else
                           hideLoadingDialog()
                }
            }

            ModuleDevTheme {
                Surface(
                    modifier = Modifier
                        .statusBarsPadding()
                        .fillMaxSize()
                ) {
                    Box(
                        modifier = Modifier
                            .fillMaxWidth()
                            .background(color = MaterialTheme.colorScheme.secondary)
                    ) {
                        Column(
                            modifier = Modifier.fillMaxSize()
                        ) {
                            UserTopBarWidget(
                                primary = MaterialTheme.colorScheme.primary,
                                onPrimary = MaterialTheme.colorScheme.onPrimary,
                                title = "退款申请",
                                topPadding = 0.dp,
                                onBackClick = ::finish
                            )

                            Column(
                                modifier = Modifier
                                    .weight(1f)
                                    .verticalScroll(rememberScrollState())
                            ) {
                                Spacer(modifier = Modifier.height(14.dp))
                                Column(
                                    modifier = Modifier
                                        .padding(horizontal = 16.dp, vertical = 6.dp)
                                        .fillMaxWidth()
                                        .background(
                                            color = MaterialTheme.colorScheme.tertiary,
                                            shape = RoundedCornerShape(8.dp)
                                        )
                                        .padding(
                                            start = 16.dp,
                                            end = 16.dp,
                                            top = 20.dp,
                                            bottom = 24.dp
                                        )
                                ) {
                                    Spacer(modifier = Modifier.height(18.dp))
                                    Text(
                                        text = "会员ID",
                                        fontSize = 16.sp
                                    )
                                    Spacer(modifier = Modifier.height(20.dp))
                                    Text(
                                        modifier = Modifier
                                            .fillMaxWidth()
                                            .background(
                                                color = MaterialTheme.colorScheme.onTertiaryContainer,
                                                shape = RoundedCornerShape(8.dp)
                                            )
                                            .padding(horizontal = 18.dp, vertical = 12.dp),
                                        text = "${UserInfoUtils.getInstance().userInfoEntity.userInfo.user_id}",
                                        fontSize = 16.sp
                                    )
                                    Spacer(modifier = Modifier.height(20.dp))
                                    Text(
                                        text = "退款理由",
                                        fontSize = 16.sp
                                    )
                                    Spacer(modifier = Modifier.height(20.dp))

                                    TextField(
                                        modifier = Modifier
                                            .fillMaxWidth()
                                            .height(150.dp),
                                        value = questionDetail.value,
                                        onValueChange = viewModel::setQuestionDetail,
                                        shape = RoundedCornerShape(8.dp),
                                        colors = TextFieldDefaults.colors(
                                            focusedContainerColor = MaterialTheme.colorScheme.onTertiaryContainer,
                                            unfocusedContainerColor = MaterialTheme.colorScheme.onTertiaryContainer,
                                            focusedIndicatorColor = Color.Transparent,
                                            unfocusedIndicatorColor = Color.Transparent,
                                            disabledIndicatorColor = Color.Transparent,
                                            focusedTextColor = MaterialTheme.colorScheme.onSurface,
                                            cursorColor = MaterialTheme.colorScheme.onSurface,
                                        ),
                                        placeholder = {
                                            Text(
                                                text = "请描述您的退款理由",
                                                fontSize = 14.sp,
                                                color = MaterialTheme.colorScheme.onSecondary
                                            )
                                        }
                                    )
                                    Spacer(modifier = Modifier.height(20.dp))

                                    val annotatedSubscribeString = buildAnnotatedString {
                                        withStyle(
                                            style = SpanStyle(
                                                color = MaterialTheme.colorScheme.onSurface,
                                                fontSize = 16.sp
                                            )
                                        ) {
                                            append("付款凭证")
                                        }

                                        pushStringAnnotation(
                                            tag = "pushString",
                                            annotation = "pushString"
                                        )

                                        withStyle(
                                            style = SpanStyle(
                                                color = MaterialTheme.colorScheme.onSecondary,
                                                fontSize = 12.sp
                                            )
                                        ) {
                                            append("（上传您的微信/支付宝支付订单截图）")
                                        }
                                    }

                                    Text(
                                        modifier = Modifier,
                                        text = annotatedSubscribeString
                                    )
                                    Spacer(modifier = Modifier.height(12.dp))

                                    FlowRow(
                                        modifier = Modifier
                                            .fillMaxWidth(),
                                        horizontalArrangement = Arrangement.spacedBy(20.dp),
                                        verticalArrangement = Arrangement.spacedBy(10.dp),
                                    ) {
                                        Box(
                                            modifier = Modifier
                                                .size(52.dp)
                                        ) {
                                            AsyncImage(
                                                modifier = Modifier
                                                    .size(44.dp)
                                                    .align(Alignment.BottomStart)
                                                    .noRippleClickable {
                                                        PhotoSelectorBuilder
                                                            .builder(this@RefundActivity)
                                                            .mode(PhotoConfig.Mode.PHOTO)
                                                            .isCopyToPrivate(true)
                                                            .maxCount(9)
                                                            .minCount(1)
                                                            .listener {
                                                                viewModel.setFeedImgData(it)
                                                            }
                                                    },
                                                model = R.mipmap.module_user_img_fkpz,
                                                contentDescription = null
                                            )
                                        }
                                        feedImgData.value.forEachIndexed { index, it ->
                                            Box(
                                                modifier = Modifier
                                                    .size(52.dp)
                                            ) {
                                                AsyncImage(
                                                    modifier = Modifier
                                                        .size(44.dp)
                                                        .clip(shape = RoundedCornerShape(8.dp))
                                                        .align(Alignment.BottomStart)
                                                        .noRippleClickable {

                                                        },
                                                    model = it,
                                                    contentDescription = null,
                                                    contentScale = ContentScale.Crop
                                                )

                                                AsyncImage(
                                                    modifier = Modifier
                                                        .size(15.dp)
                                                        .align(Alignment.TopEnd)
                                                        .noRippleClickable {
                                                            viewModel.removeFeedImage(index)
                                                        },
                                                    model = R.mipmap.module_user_icon_delete,
                                                    contentDescription = null
                                                )
                                            }
                                        }
                                    }


                                    Spacer(modifier = Modifier.height(58.dp))
                                }
                            }

                            Card(
                                colors = CardDefaults.cardColors(containerColor = MaterialTheme.colorScheme.tertiary),
                                shape = RoundedCornerShape(topStart = 30.dp, topEnd = 30.dp)
                            ) {
                                Text(
                                    modifier = Modifier
                                        .padding(horizontal = 30.dp, vertical = 30.dp)
                                        .fillMaxWidth()
                                        .background(
                                            color =
                                            if (canCommit)
                                                color0A84FF
                                            else
                                                MaterialTheme.colorScheme.background,
                                            shape = RoundedCornerShape(25.dp)
                                        )
                                        .noRippleClickable(
                                            enabled = canCommit,
                                            onClick = viewModel::commitRefund
                                        )
                                        .padding(vertical = 16.dp),
                                    text = "提交",
                                    color = if (canCommit) Color.White else color999999,
                                    fontSize = 16.sp,
                                    textAlign = TextAlign.Center
                                )
                            }
                        }
                    }
                }
            }
        }
    }
}